<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ include file="include/base.jsp" %>
<!DOCTYPE HTML>
<html>
<head>
	<meta charset="UTF-8">
	<title>首页</title>
	<link rel="stylesheet" type="text/css" href="../css/bootstrap.min.css" media="all">
	<link rel="stylesheet" type="text/css" href="../css/hou.css" media="all">
	<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
	<!-- <link rel="stylesheet" href="/resources/demos/style.css" /> -->
	<script type="text/javascript" src="../js/jquery.min.js"></script>
	<script type="text/javascript" src="../js/bootstrap.min.js"></script>
	<style type="text/css">
		.menu{
			background-color: #D9EDF7;
		}
	</style>
</head>
<body>
	<div class="container">
		<%@include file="include/top.jsp" %>
		<div class="content">
			<%@include file="include/left.jsp" %>
			
			<div class="right pull-right">
				<div class="navbar" style="width:790px;margin-bottom:0px;">
					<div class="navbar-inner">
					  <a class="brand" href="javascript:;">添加图书</a>
					</div>			
				</div>
				<div class="well" style="padding:20px;">
					<h4>添加图书</h4>
					<form method="post" action="/admin/saveBook.action" class="fm form-horizontal" enctype="multipart/form-data">
					  <select id="type1">
					  	<option value="0">--请选择大类别--</option>
					  	<option value="文学小说">文学小说</option>
						<option value="计算机">计算机</option>
						<option value="外语学习">外语学习</option>
						<option value="少儿图书">少儿图书</option>
						<option value="考试教材">考试教材</option>
						<option value="外文原版">外文原版</option>
					  </select>
					  <select id="type2" name="booktype.typeName">
					  	<option value="0">--请选择子类别--</option>
					  </select>
					  <fieldset style="margin-top:10px;">
					  <div class="control-group">
					    <label class="control-label" for="inputEmail">书名：</label>
					    <div class="controls">
					      <input type="text" placeholder="请输入书名" name="book.bookName">
					    </div>
					  </div>
					  <div class="control-group">
					    <label class="control-label" for="inputPassword">作者：</label>
					    <div class="controls">
					      <input type="text" placeholder="请输入作者" name="book.author">
					    </div>
					  </div>
					  <div class="control-group">
					    <label class="control-label" for="inputEmail">译者：</label>
					    <div class="controls">
					      <input type="text" placeholder="请输入译者" name="book.translator">
					    </div>
					  </div>
					  <div class="control-group">
					    <label class="control-label" for="inputEmail">ISBN：</label>
					    <div class="controls">
					      <input type="text" placeholder="请输入ISBN" name="book.ISBN">
					    </div>
					  </div>
					  <div class="control-group">
					    <label class="control-label" for="inputEmail">出版时间：</label>
					    <div class="controls">
					      <input type="text" placeholder="请输入出版时间" name="book.publishTime">
					    </div>
					  </div>
					  <div class="control-group">
					    <label class="control-label" for="inputEmail">出版社：</label>
					    <div class="controls">
					      <input type="text" placeholder="请输入出版社" name="publish.publishName" id="tags">
					    </div>
					  </div>
					  <div class="control-group">
					    <label class="control-label" for="inputEmail">页数：</label>
					    <div class="controls">
					      <input type="text" placeholder="请输入页数" name="book.pageNum">
					    </div>
					  </div>
					  <div class="control-group">
					    <label class="control-label" for="inputEmail">版本：</label>
					    <div class="controls">
					      <input type="text" placeholder="请输入版本" name="book.edition">
					    </div>
					  </div>
					  <div class="control-group">
					    <label class="control-label" for="inputEmail">内容简介：</label>
					    <div class="controls">
					      <textarea placeholder="请输入内容简介" name="book.content" style="width:400px;height:200px;"></textarea>
					    </div>
					  </div>
					  <div class="control-group">
					    <label class="control-label" for="inputEmail">价格：</label>
					    <div class="controls">
					      <input type="text" placeholder="请输入价格" name="book.price">
					    </div>
					  </div>
					  <div class="control-group">
					    <label class="control-label" for="inputEmail">商城价：</label>
					    <div class="controls">
					      <input type="text" placeholder="请输入商城价" name="book.saleprice">
					    </div>
					  </div>
					  <div class="control-group">
					    <label class="control-label" for="inputEmail">库存：</label>
					    <div class="controls">
					      <input type="text" placeholder="请输入库存" name="book.num">
					    </div>
					  </div>
					  <div class="control-group">
					    <label class="control-label" for="inputEmail">危险数量：</label>
					    <div class="controls">
					      <input type="text" placeholder="请输入危险数量" name="book.dangerNum">
					    </div>
					  </div>
					  <div class="control-group">
					    <label class="control-label" for="inputEmail">状态：</label>
					    <div class="controls">
					      <input type="text" placeholder="请输入状态" name="book.state">
					    </div>
					  </div>
					  <div class="control-group">
					    <label class="control-label" for="inputEmail">图片：</label>
					    <div class="controls">
					      <input type="file" name="picture">
					    </div>
					  </div>
					  <div class="control-group">
					    <div class="controls">
					      <button type="submit" class="btn">添加图书</button>
					    </div>
					  </div>
					  </fieldset>
					</form>
				</div>
			</div>
		</div>
	</div>
	<script type="text/javascript" src="../js/jquery.min.js"></script>
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
	<script type="text/javascript" src="../js/validate/jquery.validate.js"></script>
	<script type="text/javascript">
		$(function(){
			//省市级联效果
			var type1=$("#type1");
			var type2=$("#type2");
			var dataSource=[];
			dataSource["文学小说"]=["世界名著","古代小说","现代小说","都市小说","武侠小说","官场小说"];
			dataSource["计算机"]=["程序设计","软件工程","网络安全"];
			dataSource["外语学习"]=["英语","日语","韩语"];
			dataSource["少儿图书"]=["儿童文学","儿童教育","少儿英语"];
			dataSource["考试教材"]=[];
			dataSource["外文原版"]=[];
			type1.change(function(){
				$("#type2>option").length=1;//选择器连用，是这样用的，在$里
				var value=this.value;
				$("#type2").html("<option value='0'>--请选择子类别--</option>"); 
				for(var index in dataSource[value]){
					var option=new Option(dataSource[value][index],dataSource[value][index]);
					type2.append(option);
				}
			});
			//autocomplete
		    $.get("/admin/getPublishs.action",function(json){
		    	var availableTags=json;
		    	//alert(json);
		    	$( "#tags" ).autocomplete({
			      source: availableTags
			    }); 
		    });
		    //验证
			$(".fm").validate({
				rules:{
					/* 值最小为1，即大于0*/
					'booktype.typeName':{
						min:[1]
					},
					'book.bookName':{
						required:true
					},
					'book.author':{
						required:true
					},
					'publish.publishName':{
						required:true
					},
					'book.price':{
						required:true
					},
					'book.saleprice':{
						required:true
					},
					'book.num':{
						required:true
					},
					'book.dangerNum':{
						required:true
					},
					'book.state':{
						required:true
					}
				},
				messages:{
					/* 在这里提示它，选择类型 */
					'booktype.typeName':{
						min:'请选择图书类型'
					},
					'book.bookName':{
						required:'请输入书名'
					},
					'book.author':{
						required:'请输入作者'
					},
					'publish.publishName':{
						required:'请选择出版社'
					},
					'book.price':{
						required:'请输入价格'
					},
					'book.saleprice':{
						required:'请输入商城价'
					},
					'book.num':{
						required:'请输入库存'
					},
					'book.dangerNum':{
						required:'请输入危险数量'
					},
					'book.state':{
						required:'请输入图书状态'
					}
				}				
			});
		});
		
	</script>
</body>
</html>